{% extends "projects/project_edit_base.html" %}

{% load i18n %}

{% block title %}{% trans "Redirect" %}{% endblock %}

{% block project-redirects-active %}active{% endblock %}
{% block project_edit_content_header %}{% trans "Redirects" %}{% endblock %}

{% block extra_scripts %}
    <script type="text/javascript">

        var update_outcome = function() {
            $('#id_from_url').parent().hide()
            $('#id_to_url').parent().hide()
            $('#dynamic-redirect').hide()

            let redirect_type = $('#id_redirect_type').val();
            if (redirect_type == 'prefix') {
                $('#id_from_url').parent().show()
                $('#id_to_url').parent().hide()
            }
            else if (redirect_type == 'page') {
                $('#id_from_url').parent().show()
                $('#id_to_url').parent().show()
            }
            else if (redirect_type == 'exact') {
                $('#id_from_url').parent().show()
                $('#id_to_url').parent().show()
            }

            var field_from_url = $('#id_from_url');
                field_to_url =  $('#id_to_url');
                option = $('#id_redirect_type').val();
                redirect_from = "";
                redirect_target = "";

            if (option === "prefix") {
                redirect_from = field_from_url.val() + "faq.html";
                redirect_target = "/$lang/$version/faq.html";
            }
            else if (option === "page" ) {
                redirect_from = "/$lang/$version/" + field_from_url.val().replace(/^\/+/, '');
                redirect_target = "/$lang/$version/" + field_to_url.val().replace(/^\/+/, '');
            }
            else if (option === "exact" ) {
                redirect_from =  field_from_url.val();
                redirect_target =  field_to_url.val();
            }

            if (redirect_from && redirect_target) {
                var result = "Outcome: " + redirect_from + " -> " + redirect_target;
                $('#dynamic-redirect').text(result).show();
            } else {
                $('#dynamic-redirect').text("").hide();
            }
        };

        $(document).ready(function() {
            update_outcome();
            $('#id_redirect_type').bind('change', function(ev) {
                update_outcome();
            });
            $('#id_from_url, #id_to_url').keyup(update_outcome);
        });

    </script>
{% endblock %}

{% block project_edit_content %}
  <p class="help_text">
    {% blocktrans trimmed with docs_url='https://docs.readthedocs.io/page/user-defined-redirects.html' %}
        Add redirects for your project. This allows you to fix links to old pages that are 404ing. <a href="{{ docs_url }}">Learn more</a>.
    {% endblocktrans %}
  </p>

  <form method="post" action=".">{% csrf_token %}
    {{ form.as_p }}
    <div id="dynamic-redirect" class="empty"></div>
    <input type="submit" value="{% trans "Save" %}">
  </form>

  {% if redirect %}
    <form
        method="post"
        action="{% url 'projects_redirects_delete' project_slug=project.slug redirect_pk=redirect.pk %}">
      {% csrf_token %}
      <input type="submit" value="{% trans "Delete" %}">
    </form>
  {% endif %}
{% endblock %}
